<!doctype html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no" />
    <link rel="stylesheet" type="text/css" href="../css/neibuyuangongbaoming.css" />
    <title>活动报名</title>
</head>
<body>
    <div id="detail">
        <!-- <div class="act"><b>活动主题</b>：活动里程5折抢购</div>
        <div class="act"><b>活动时间</b>：2017年8月1日-2017年9月25日</div> -->
    </div>
    <!-- 活动标题时间模板 begin -->
    <script type="text/html" id="detail-template">
        <div class="act"><b>活动主题</b>：{{title}}</div>
        <div class="act"><b>活动时间</b>：{{time_start.split(' ')[0]}} 至 {{time_end.split(' ')[0]}}</div>
		
		<!-- 活动标题时间模板 end -->
		<div class="content">
			<div class="basic"><span class="color">*</span><b>基本资料填写</b></div>

			<div class="frame">
				<span class="name">姓名：</span>
				<div class="input">
					<input type="text" id="name" placeholder="填写真实姓名">
				</div>
			</div>  
			<div class="frame">
				<span class="name">性别：</span>
				<div class="input">
					<label>
						<span class="gender active" data-sex="1" onclick="fnSex(this)"><span class="circular"></span>男</span>
					</label>
					<label>
						<span class="gender" data-sex="2" onclick="fnSex(this)"><span class="circular"></span>女</span>
					</label>
				</div>
			</div> 
			<div class="frame">
				<span class="name">联系电话：</span>
				<div class="input">
					<input type="tel" placeholder="+86" id="tel">
				</div>
			</div> 
			<div class="frame">
				<span class="name">单位名称：</span>
				<div class="input">
					<select class="inner">
						<option value="">请选择</option>
						{{each unit_id}}
						<option value="{{$value.id}}" {{if $value.id==cid}} selected {{/if}}>{{$value.title}}</option>
						{{/each}}
					</select>
				</div>
			</div> 
			
			<div class="frame number hide">
				<span class="name">工牌号：</span>
				<div class="input">
					<input type="text" id="unit_number" placeholder="请填写工牌号">
				</div>
			</div>
			<div class="frame identity hide">
				<span class="name">身份证号: </span>
				<div class="input">
					<input type="text" placeholder="请填写身份证号" id="identity">
				</div>
			</div>
			
			<div onclick="fnUpload(this)" class="frame on-line">
				<span class="name">上传照片：</span>
				<div class="input">
					<div class="img"></div>
				</div>
			</div>
			
			<div id="reason" class="no-line hide">
				<span class="declaration">驳回原因：</span>
				<div class="textarea" contenteditable="false" ></div>
			</div>
			
			
			<div class="submit" onclick="fnSubmit()">提交申请</div> 
		</div>
    </script>
</body>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript" src="../framework/template-web.js"></script>
<script type="text/javascript" src="../framework/zepto.min.js"></script>
<script type="text/javascript" src="../script/base.js"></script>
<script type="text/javascript">
    var param =  fnGetUrlParam();

    fnDetails();
    function fnDetails(){
        //公司名称列表
        fnAjax({
            url: "Company/aList",
            data: {
				type:param.type
            },
        }, function(ret){
            if( !ret.status ){
				var _unit_ids = ret.data.list;
				//活动详情
				fnAjax({
					url: "Active/detail",
					data: {
						id:fnGetUrlParam().id
					},
				}, function(ret){
					if( !ret.status ){
						ret.data.unit_id = _unit_ids;
						if(ret.data){
							fnStatus(ret.data);
						}
					}else{
						
					}
				});
            }else{
                
            }
        });
    }

    //查询用户状态
    function fnStatus(_el){
    	fnAjax({
            url: "Active/examineDetail",
            data: {
				id:fnGetUrlParam().id,
            },
        }, function(ret){
            if( !ret.status ){
            	_el.cid = ret.data.unit_id;
            	imgUrl = ret.data.pictrue;
            	fnValue('#detail',template('detail-template', _el));
            	if(ret.data.examine_type=='1'){
            		fnValue('.submit','审核中');
            		$('.submit').addClass('no-onclick');
            	}else if(ret.data.examine_type=='2'){
            		fnValue('.submit','重新提交申请');
					$('#reason').removeClass('hide');
					fnValue('#reason .textarea', ret.data.reason);
            	}else{
            		fnValue('.submit','已通过审核');
            		$('.submit').addClass('no-onclick');
            	}
				$('.img').css("background-image","url("+ret.data.pictrue+")");
				fnValue('#name',ret.data.username);
				fnValue('#tel',ret.data.tel);
				fnValue('#unit_number',ret.data.unit_number);
				fnValue('#identity',ret.data.identity);
				$('.gender').removeClass('active');
				$("[data-sex='"+ret.data.sex+"']").addClass('active');
            }else{
            	fnValue('#detail',template('detail-template', _el));
			    if(param.type == '1'){
			        $('.number').removeClass('hide');
			        $('.inner').removeClass('hide');
			    }else{
			        $('.identity').removeClass('hide');
			        $('.out').removeClass('hide');
			    }
            }
        });
    }

    //选择性别
    function fnSex( _el ){
        $('.gender').removeClass('active');
        $( _el ).addClass('active');
    }

    //提交申请
    function fnSubmit(){
        var _param = {};
        _param.active_id = param.id;
        _param.unit_type = param.type;
        _param.sex = $('.gender.active').attr('data-sex');
        if(fnValue("#name")){
            _param.username = fnValue("#name");
        }else{
            fnToast('请填写真实姓名');
            return
        }
        if(fnValue("#tel")){
            if( fnVerify( 'Phone' ).test( fnValue( '#tel' ) )){
                _param.tel = fnValue("#tel");
            }else{
                fnToast('手机号码格式错误');
                return
            }
        }else{
            fnToast('请填写手机号码');
            return
        }
        
    	if($('.inner').val()){
    		_param.unit_id = fnValue(".inner");
    	}else{
    		fnToast('请选择单位');
            return
    	}
       
        if(param.type == '1'){
            if(fnValue("#unit_number")){
                _param.unit_number = fnValue("#unit_number");
            }else{
                fnToast('请填写工号牌');
                return
            }
        }else if(param.type == '2'){
            if(fnValue("#identity")){
                if( fnVerify( 'ID' ).test( fnValue( '#identity' ) )){
                    _param.identity = fnValue("#identity");
                }else{
                    fnToast('请填写身份证号码格式错误');
                    return
                }
            }else{
                fnToast('请填写身份证号');
                return
            }
        }
        if(imgUrl){
            _param.pictrue = imgUrl;
        }else{
            fnToast('请上传照片');
            return
        }
        fnAjax({
            url: "Active/addAndUpSigUp",
            data: _param,
        }, function(ret){
            if( !ret.status ){
                fnToast(ret.msg,function(){
                    fnOpen("index.html");
                });
            }else{
                fnToast(ret.msg);
            }
        });
    }
	

    var imgUrl='';
	function fnUpload(_el){
	//alert(location.href.split('#')[0]);
		//活动详情
		fnAjax({
			url: "Menu/getJSConfig",
			data: {
				url: location.href.split('#')[0]
			},
		}, function(ret){
			if( !ret.status ){
				var _data = {
					debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
					appId: ret.data.appId, // 必填，企业号的唯一标识
					timestamp: ret.data.timestamp, // 必填，生成签名的时间戳
					nonceStr: ret.data.nonceStr, // 必填，生成签名的随机串
					signature: ret.data.signature,// 必填，签名，见附录1
					jsApiList: ['chooseImage','uploadImage','downloadImage'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
				};
				wx.config(_data);
				wx.chooseImage({
					count: 1, // 默认9
					sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
					success: function (res) {
						var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
						function upload() {
			                wx.uploadImage({
			                    localId: localIds.toString(),
			                    isShowProgressTips: 1, // 默认为1，显示进度提示
			                    success: function (res) {
			                        server_id = res.serverId; // 返回图片的服务器端ID
			                        fnAjax({
							        	url:"Upload/fnUpImg",
							        	data:{
							        		serverId: server_id
							        	},
							        },function(r){
							        	if( !r.status ){
							        		fnToast(r.msg);
							                imgUrl = r.data;
											$('.img').css("background-image","url("+imgUrl+")");
							            }else{
							                fnToast(r.msg);
							            }
							        })
			                    },
			                    fail: function (res) {
			                        //alert(JSON.stringify(res));
			                    }
			                });
			            }
			            upload();
					}
				});
			}else{
				
			}
		});
	}
</script>
</html>
